<template>
  <div class="detail">
    <el-row>
      <el-col :span="11">
        <span class="text">状态: </span>
        <span class="text">{{state()}}</span>
      </el-col>
      <el-col :span="13">
        <span class="text">紧急度: </span>
        <span style="color: red" v-if="transportObj.aog === 1">AOG</span>
        <span v-else>非AOG</span>
      </el-col>
    </el-row>
    <el-row>
      <el-col :span="11">
        <span class="text">申请批次: </span>
        <span>{{transportObj.applyBatch}}</span>
      </el-col>
      <el-col :span="13">
        <span class="text">申请日期: </span>
        <span>{{transportObj.applicationTime.substr(0,11)}}</span>
      </el-col>
    </el-row>
    <el-row>
      <el-col :span="11">
        <span class="text">始发站: </span>
        <span>{{transportObj.startStation}}</span>
      </el-col>
      <el-col :span="13">
        <span class="text">目的站: </span>
        <span>{{transportObj.targetStation}}</span>
      </el-col>
    </el-row>
    <el-row>
      <el-col :span="11">
        <span class="text">交货单位: </span>
        <span>{{transportObj.deliveryUnit}}</span>
      </el-col>
      <el-col :span="13">
        <span class="text">收货单位: </span>
        <span>{{transportObj.receiveUnit}}</span>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import { transoprtState,formatTime } from '@/assets/js/common.js'
export default {
  // 组件属性、变量
  props: {
    transportObj: {
      type: Object,
      default() {
        return {}
      }
    }
  },
  // 变量
  data() {
    return {
    }
  },
  methods: {
    // 状态
    state() {
      let state = ''
      transoprtState.forEach(item => {
        if(item.id === this.transportObj.state) state = item.name
      })
      return state
    }
  },
  // 生命周期函数
  created() {
  },
  mounted() {
  }
}
</script>

<style scoped>
.text {
  font-weight: bold;
}
.detail {
  margin: 2.778vw;
  padding: 1.389vw;
  border: 1px solid rgba(0, 0, 0, .3);
  font-size: 3.889vw;
  border-radius: 5px;
  background-color: white;
  box-shadow: 0 5px 5px -1px rgba(0, 0, 255, .1);
  overflow: hidden;
}
</style>
